<template>
  <div id="container">
    <el-container>

      <el-aside width="200px" class="side_border-setting">

        <el-menu
            default-active="2"
            class="el-menu-vertical-demo"
            router
        >
<!--          <div class="header_menu">-->
<!--            个人中心-->
<!--          </div>-->
          <el-menu-item class="text-setting extra-setting">个人中心</el-menu-item>
          <el-menu-item class="text-setting" index="/account/setting">我的信息</el-menu-item>
          <el-menu-item class="text-setting" index="/account/avatar">我的头像</el-menu-item>
        </el-menu>
      </el-aside>
      <el-main class="main-setting"><router-view></router-view></el-main>
    </el-container>
  </div>
</template>
<script setup>

</script>
<style scoped>
#container{
  width: 1000px;
  min-height: 600px;
  margin: 0 auto;
  box-shadow: 0 0 5px #ccc;
}
.header_menu{
  width: 200px;
  height: 56px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.text-setting{
  display: flex;
  justify-content: center;
  align-items: center;
  //border: 1px solid gray;

}
.extra-setting{
  border: 1px solid #eee;
}
.side_border-setting{
  border: 1px solid #eee;
  min-height: 600px;
}
.main-setting{
  padding: 0;
}
</style>